import { ref, onMounted, onUnmounted, Ref } from "vue";

interface MousePoint {
  x: Ref<string>
  y: Ref<number>
}

export default function useMouse(): MousePoint {
  let x = ref<number>(0);
  let y = ref(0);
  function update(e: MouseEvent) {
    x.value = e.pageX;
    y.value = e.pageY;
  }
  onMounted(() => {
    window.addEventListener("mousemove", update);
  });
  onUnmounted(() => {
    window.removeEventListener('mousemove', update);
  });
  return { x, y };
}
